<template>
    <div class="search-container">
        <div class="search">
            <van-search v-model="value" show-action placeholder="请输入搜索关键词" @cancel="$router.back()" />
        </div>
        <div class="scroll">
            <TabList :title="title" :list="(goods as CatsTree.myGoods)" />
        </div>
    </div>
</template>

<script lang="ts" setup>
import TabList from '@/components/tab.vue'
import { getSearchNewGoodsList, getSearchSellGoodsList, getSearchSynGoodsList, type CatsTree } from '@/api'
import { ref, watchEffect } from 'vue'

const value = ref<any>()
// 搜索页下商品标题
const title = ref<string[]>(['综合', '销量', '新品'])
// 数据传给组件的
const goods = ref<CatsTree.myGoods>([])

// 接口参数
const parmas = {
    _page: 1,
    _limit: 10
}
// 并发队列 
const newGoodsList = [getSearchNewGoodsList(parmas), getSearchSellGoodsList(parmas), getSearchSynGoodsList(parmas)]
watchEffect(async () => {
    const result = await Promise.all(newGoodsList)
    goods.value = result // 赋值

})


</script>

<style lang="scss" scoped>
.search-container {
    height: 100%;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.scroll {
    // flex: 1;
    overflow-y: auto;
}
</style>